<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Document</title>
</head>
<body>
	<script>
		// "use strict"



		
		function bindThis(fn,obj) {
			return fn.bind(obj)
		}
		function bindThis(fn,obj) {
			return function(){
				return fn.apply(obj,argurmnts)
			}
		}

		// 类的属性特征、访问器、代理
		// 1、类的属性特征
		console.log('--------对象的属性特征查看与修改------')
		var obj1 = {age:30};
		obj1.name="zhansan"
		console.log("显示obj1的全部属性特征：",Object.getOwnPropertyDescriptors(obj1))
		console.log("显示obj1的age属性特征：",Object.getOwnPropertyDescriptor(obj1,"age"))
		// console.log("修改obj1的age属性特征：",Object.defineProperty(obj1,"age",{//修改obj的age属性的特征
		// 	configurable: true,
		// 	enumerable: false,
		// 	value: 40,
		// 	writable: false,
		// }));
		console.log("批量修改obj1的属性特征：",Object.defineProperties(obj1,{//修改obj的age属性的特征
			name:{
				configurable: true,
				enumerable: false,
				value:"lisi",
				writable: false,
			},
			age:{
				configurable: true,
				enumerable: false,
				value: 50,
				writable: false,
			}
			
		}))
		obj1.age=60;//无效的操作
		console.log("修改obj1的age属性特征后",obj1,Object.keys(obj1),Object.getOwnPropertyNames(obj1))


		// 2、不允许对象中添加属性的api
		console.log('--------不允许对象中添加属性的api------')
		var obj2={name:"小红",age:89}
		Object.preventExtensions(obj2);//表示不运行在向obj2中添加属性
		obj2.sex="女";//无效操作
		obj2.name="小红1";//有效操作
		delete obj2.age//有效操作
		console.log("obj2是：", obj2)

		// 3、封闭对象的api
		console.log('--------封闭对象的api------')
		var obj3={name:"小率",age:19}
		Object.seal(obj3);//表示不允许在向obj2中添加属性
		obj3.sex="女";//无效操作
		obj3.name="小率1";//有效操作
		delete obj3.age//无效操作
		console.log("obj3是：", obj3)

		// 4、冻结对象的api
		console.log('--------冻结对象的api------')
		var obj4={name:"小贵",age:29}
		Object.seal(obj4);//表示不运行在向obj2中添加属性
		obj4.sex="女";//无效操作
		obj4.name="小贵1";//有效操作
		delete obj4.age//无效操作
		console.log("obj4是：", obj4)



		// 5、对象的访问器（本质是操作对象属性的方法get set）
		console.log('--------对象的访问器------')
		var obj5={
					name:"小铃铛",
					age:11,
					data:{sex:"女",height:170},//私有属性
					get sex(){//get访问器查看私有属性
							return this.data.sex
					},
					set sex(value){//set访问器修改私有属性
						this.data.sex = value;
						return true
					},
					get myInformatioan(){//get访问器伪造属性myInformatioan
						let myInformatioan = this.name+"是"+this.data.sex+"今年"+this.age+"岁"
							return myInformatioan
					},
					set allInfo(value){//set访问器批量设置属性
						[this.name,this.age] = value.split(",");
						return true
					},
					get token(){//get访问器与本地存储结合
							return localStorage.getItem("token")
					},
					set token(value){//set访问器与本地存储结合
						localStorage.setItem("token",value)
						return true
					},
					// set age(value){//set访问器修改对象age属性
					// 	this.age = value
					// 	return true
					// },

				}

		console.log("5.1 访问器查看obj5中的私有属性sex是：", obj5.sex)
		obj5.sex="女女女"
		console.log("5.2 访问器修改obj5中的私有属性sex是：", obj5.sex)
		console.log("5.3 访问器伪造属性myInformatioan是：", obj5.myInformatioan)
		obj5.allInfo="小铃铛111,34"
		console.log("5.4 访问器批量设置属性是：", obj5)
		obj5.token="11111111111"
		console.log("5.5 访问器与本地存储结合token是：", obj5.token)
		obj5.age=44;
		console.log("5.6 访问器与obj5.属性的优先级是：访问器高", obj5.age)



		// 6、proxy代理
		console.log("-------代理对象------")
		// 6.1 代理对象
		var obj6 = {
			name:"七七",
			age:23
		}
		const proxy = new Proxy(obj6,{ 
			get(obj,property){
				let value = obj[property] +"-get-"
				return value
			},
			set(obj,property,value){
				obj[property]=value +"-get-";
				return true
			}
		})
		proxy.sex = "男男男"
		console.log("proxy代理对象：",proxy.age,obj6)



		// 6.2 代理函数
		console.log("-------代理函数------")
		function jisuan(num1,num2,fuhao){
			var res =0;
			switch (fuhao){
				case '+': res = Number(num1) + Number(num2)
					break;
				case "-":res = Number(num1) - Number(num2)
					break;
				case "*": res = Number(num1) * Number(num2)
					break;
				case "/": res = Number(num1) / Number(num2)
					break;
				default: res = "符号错误"
			}
			return console.log(res)
				
		}

		// jisuan(22,99,"*");
		const proxyFn = new Proxy(jisuan,{
			apply(func,obj,argurmnts){
				func.apply({},argurmnts)

			}
		})
		proxyFn(2,3,"*")


		// 6.2 代理数组
		console.log("-------代理数组------")
		let arrlist = ["小明","小黑"];
		const proxtArr = new Proxy(arrlist,{
			get(arr,index){
				return arr[index]
			},
			set(arr,index,value){
				arr[index]=value
				return true

			}

		})
		arrlist[2]="小狗"
		console.log('代理数组访问元素：',proxtArr[1],arrlist)

	</script>
</body>
</html>